<template>
  <confirm-dialog
    :title="title"
    :visible="visible"
    :loading="loading"
    @handleClose="handleClose"
    width="25%"
  >
  <template slot="content">
    <span class="tips">{{$t('desktopManage.unbindClientTitleTips')}}</span>
  </template>
  <template slot="footer">
    <el-button @click="handleClose">{{$t('common.cancel')}}</el-button>
    <el-button :disabled="loading" type="primary" @click="submit">{{$t('common.confirm')}}</el-button>
  </template>
  </confirm-dialog>
</template>
<script lang="ts">
import Vue from 'vue'
import FormDialop from '../../../components/Dialog/formDialog.vue';
import ConfirmDialog from '../../../components/Dialog/confirmDialog.vue';
export default Vue.extend({
  components: {
    FormDialop,
    ConfirmDialog
  },
  data() {
    return {
      title: '',
      visible: false,
      loading: false,
      content: '',
      data: {},
    }
  },
  methods: {
    handleClose () {
      this.visible = false;
      this.loading = false;
      
    },
    init(row: any) {
      this.visible = true;
      (this as any).title = this.$t('desktopManage.unbindClienttips');
      this.data = JSON.parse(JSON.stringify(row))
      // console.log(this.data)
    },
    submit() {
      this.loading = true;
      this.$pandaApi.apiPostDesktopBindClient((this as any).data.id, {
            "hardware_ids": []
          }).then((res: any) => {
            if(res.code == 200) {
              this.$message.success((this as any).$t('desktopManage.unbindClientSuccess'))
              this.$emit("success")
              this.loading = false;
              this.visible = false;
            }
          }).catch(() => {
            this.$message.warning((this as any).$t('desktopManage.unbindClientFail'))
            this.loading = false;
            this.visible = false;
          })
    }
  }
})
</script>
<style scoped>
.tips {
  font-size: 12px;
  color: gray;
}
</style>
